<!doctype html>
<html lang="cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="{{asset('/css/mdui.min.css')}}">
    <style>
        body{
            background: #f5f5f5 url("{{asset('/images/auth_bg.gif')}}");
        }
        .auth-warp {
            width: 820px;
            margin: 0 auto;
            padding-top: 20px;
            padding-bottom: 20px;
        }

        .logo {
            width: 150px;
            margin: 0 auto;
            margin-bottom: 30px;
        }

        .logo a i {
            font-size: 100px;
            line-height: 100px;
        }
        .form-container{
            background-color: #fff;
            border-radius: 5px;
        }
        .left-side{
            border-right: 2px solid #fafafa;
        }
    </style>
    @yield('css')
    <title>@yield('title','微博')</title>
</head>
<body class="mdui-theme-primary-blue mdui-theme-accent-blue">
<div class="auth-warp">
    {{--logo--}}
    <div class="logo mdui-valign">
        <a href="{{url('/')}}" class="mdui-center">
            <i class="mdui-icon material-icons ">all_inclusive</i>
        </a>
    </div>
    {{--表单容器--}}
    <div class="mdui-container mdui-shadow-5 form-container">
        <div class="mdui-row mdui-p-y-3">
            {{--左栏--}}
            <div class="mdui-col-xs-7 left-side">
                @yield('left')
            </div>
            {{--右栏--}}
            <div class="mdui-col-xs-5 mdui-p-x-4">
                @yield('right')
            </div>
        </div>
    </div>
</div>

<script src="{{asset('/js/jquery-1.8.3.min.js')}}"></script>
<script src="{{asset('/js/jquery.validate.min.js')}}"></script>
<script src="{{asset('/js/mdui.min.js')}}"></script>
@yield('js')

</body>
</html>